<template>
  <div class="flex direction-column height-100">
    <div class="search-form" v-if="false">
      <el-form inline>
        <el-form-item label="关键字">
          <el-input v-model="keyword" placeholder="企业名称"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button icon="el-icon-search" type="primary" @click="onSearch">查询</el-button>
        </el-form-item>
      </el-form>
    </div>
    <el-table
      v-loading="loading" :data="lists"
      :header-cell-style="{
        backgroundColor: themeColor,
        color: 'white'
      }" class="table"
      height="100%"
    >
      <div slot="empty" class="empty-lists">
        <svg-icon name="search"></svg-icon>
        <span class="empty-text">暂无数据</span>
      </div>
      <el-table-column v-for="column in columns" :key="column.prop" v-bind="column">
        <template v-if="column.prop === 'enterpriseName'" #default="{ row }">
          <el-link :underline="false" type="primary" style="font-size: 12px;" @click="navigateToEnterpriseAnalysis(row, 'enterpriseCode')">
            {{row.enterpriseName}}
          </el-link>
        </template>
      </el-table-column>
    </el-table>
    <el-pagination
      :current-page.sync="pagination.pageNumber" :page-size="pagination.pageSize"
      :total="pagination.total" background
      class="pagination"
      hide-on-single-page layout="total,prev,pager,next"
      @current-change="getLists"
    ></el-pagination>
  </div>
</template>

<script>
import { getListEnterprise } from '@/api/enterprose'
import Navigate2enterpriseAnalysis from '@/mixins/navigate2enterpriseAnalysis'

export default {
  name: 'company-analysis',
  mixins: [Navigate2enterpriseAnalysis],
  data () {
    return {
      keyword: '',
      loading: false,
      lists: [],
      columns: [
        {
          label: '企业名称',
          prop: 'enterpriseName'
        },
        {
          label: '所属区域',
          prop: 'districtBelongName'
        },
        {
          label: '所属行业',
          prop: 'belongIndustryName'
        },
        {
          label: '联系人',
          prop: 'principal'
        },
        {
          label: '联系电话',
          prop: 'principalPhone'
        },
        {
          label: '能源消费总量（吨标准煤）',
          prop: 'total'
        },
        {
          label: '同比',
          prop: 'growth'
        },
      ],
      pagination: {
        pageNumber: 1,
        pageSize: 12,
        total: 0
      }
    }
  },
  computed: {
    themeColor () {
      return this.$store.state.user.theme
    },
    qs () {
      return {
        keyword: this.keyword
      }
    }
  },
  mounted () {
    this.getLists()
  },
  methods: {
    getLists () {
      this.loading = true
      return getListEnterprise().then(res => {
        if (res.code === 200) {
          res.data.forEach(v => {
            v.total = '-'
            v.growth = '-'
          })
          this.lists = res.data
        }
      }).finally(() => {
        this.loading = false
      })
    },
    onSearch () {
      this.$nextTick(() => {
        this.getLists()
      })
    },
  }
}
</script>

<style scoped>

</style>
